/*
 * @Author: 张升 1562821455@qq.com
 * @Date: 2024-11-04 17:02:30
 * @LastEditors: 张升 1562821455@qq.com
 * @LastEditTime: 2024-11-12 09:25:56
 * @FilePath: \react-demo\src\contextStore.js
 * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
 */
import React, { useReducer, createContext } from 'react'
// immer是一个用于管理不可变数据的库，常用来代替lodash的深拷贝,轻量级，性能好，使用简单
import {produce} from 'immer'
let initStore = {
	user: {
		name: 'takzhang',
		email: 'johndoe@example.com',
		password: 'password123',
		id: '1234567890',
		token: '1234567890',
		profilePic: 'https://example.com/profilepic.jpg',
		bio: 'I am a software developer',
	},
	theme: 'light',
	language: 'en',
	menuData: [
		{
			id: 1,
			parentId: null,
			name: '首页',
			key: 'home',
			path: '/home',
		},
		{
			id: 2,
			parentId: null,
			name: '学习',
			key: 'study',
			path: '/study',
			children: [
				{
					id: 201,
					parentId: 2,
					name: 'effecHook学习',
					key: 'effecHook',
					path: '/study/effectHook',
					icon: 'home',
				},
				{
					id: 202,
					parentId: 2,
					name: 'refHook学习',
					key: 'refHook',
					path: '/study/refHook',
					icon: 'setting',
				},
				{
					id: 203,
					parentId: 2,
					name: 'memoHook学习',
					key: 'memoHook',
					path: '/study/memoHook',
					icon: 'user',
				},
				{
					id: 204,
					parentId: 2,
					name: 'reducerHook学习',
					key: 'reducerHook',
					path: '/study/reducerHook',
					icon: 'home',
				},
				{
					id: 205,
					parentId: 2,
					name: 'contextHook学习',
					key: 'contextHook',
					path: '/study/contextHook',
					icon: 'user',
				},
			]
		},
		{
			id: 3,
			parentId: null,
			name: '其他',
			key: 'other',
			path: '/other',
			children: [
				{
					id: 301,
					parentId: 3,
					name: '样式',
					key: 'style',
					path: '/other/style',
					icon: 'setting',
					children: [
						{
							id: 30101,
							parentId: 301,
							name: '普通样式',
							key: 'normal_style',
							path: '/other/style/normal',
						},
						{
							id: 30102,
							parentId: 301,
							name: 'Module样式',
							key: 'module_style',
							path: '/other/style/module',
						},
						{
							id: 30103,
							parentId: 301,
							name: 'styledCompnent样式',
							key: 'styledCompnent_style',
							path: '/other/style/styledCompnent',
						},
					]
				},
				{
					id: 302,
					parentId: 3,
					name: 'antd举例',
					key: 'antds',
					path: '/other/antds',
					icon: 'apple',
					children: [
						{
							id: 30201,
							parentId: 302,
							name: '第一弹',
							key: 'antd1',
							path: '/other/antds/antd1',
						},
						{
							id: 30202,
							parentId: 302,
							name: '第二弹',
							key: 'antd2',
							path: '/other/antds/antd2',
						},
						{
							id: 30203,
							parentId: 302,
							name: '第三弹',
							key: 'antd3',
							path: '/other/antds/antd3',
						},
						{
							id: 30204,
							parentId: 302,
							name: '第四弹',
							key: 'antd4',
							path: '/other/antds/antd4',
						}
					]
				}
			]
		},
		{
			id: 4,
			parentId: null,
			name: '更多',
			key: 'more',
			path: '/more',
			children: [
				{
					id: 401,
					parentId: 4,
					name: '个人中心',
					key: 'personal',
					path: '/more/personal',
					icon: 'user',
				},
			]
		},
	]
}
// 最大设置8层级子项值
const setObjVal = (obj, location, state, value) => {
	if (location.length === 1) { state[location[0]] = value }
	if (location.length === 2) { state[location[0]][location[1]] = value }
	if (location.length === 3) { state[location[0]][location[1]][location[2]] = value }
	if (location.length === 4) { state[location[0]][location[1]][location[2]][location[3]] = value }
	if (location.length === 5) { state[location[0]][location[1]][location[2]][location[3]][location[4]] = value }
	if (location.length === 6) { state[location[0]][location[1]][location[2]][location[3]][location[4]][location[5]] = value }
	if (location.length === 7) { state[location[0]][location[1]][location[2]][location[3]][location[4]][location[5]][location[6]] = value }
	if (location.length === 8) { state[location[0]][location[1]][location[2]][location[3]][location[4]][location[5]][location[6]][location[7]] = value }
	else if (location.length > 8 || location.length === 0) console.error('ERROR[/utils/storeUtils:39]: length exceed or 0')
}
const reducer = (state = initStore, action) => produce(state, draft => {
	let { type, data } = action
	switch (type) {
		case 'setStore':
			let key = data.path
			let value = data.value
			if (key.length > 0) {
				if (key.indexOf('.') === -1) key += '.'
				let loc = key.split('.')
				loc = loc.filter(item => item.trim() !== '')
				setObjVal({}, loc, draft, value)
			} break;
		default:
	}
})
export const Context = createContext(initStore)
// 使用Context.Provider包裹整个应用，将state和dispatch传递给子组件,实现全局状态管理
const ContextStore = ({children}) => {
	const [state, dispatch] = useReducer(reducer, initStore)
	return (
		<Context.Provider value={[state, dispatch]}>
			{children}
		</Context.Provider>
	)
}
export default ContextStore